<!--
 * @Description: 我要报修
 * @Author: Ronda
 * @Date: 2022-02-16 09:30:08
 * @LastEditors: Ronda
 * @LastEditTime: 2022-05-23 15:13:16
-->
<template>
  <div>
    <div class="title">我要报修</div>

    <div style="padding-top: 25px; font-weight: 700;">请选择需要报修的工程设备</div>

    <div style="margin: 10px 0;"></div>

    <!-- 工程设备联级输入框 -->
    <!-- {{ obj }} -->
    <el-cascader-panel :props="{ value: 'name', label: 'name' }" :options="options" v-model="option"></el-cascader-panel>

    <div style="margin: 20px 0;"></div>

    <div  style="font-weight: 700">报修原因</div>

    <div style="margin: 10px 0;"></div>

    <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入内容" v-model="textarea">
    </el-input>

    <div style="margin: 20px 0;"></div>

    <el-button type="primary" icon="el-icon-thumb" @click="toSave">提交</el-button>

  </div>
</template>

<script>
import { get, postJSON, del } from "@/utils/request";

export default {
  data() {
    return {
      obj: {
        engineer_id: 0,
        device_id: 0,
        bill_why: ''
      },
      option: [],
      textarea: '',
      options: []
      // options: [{
      //   "value": 'shangxinongda',
      //   "label": "山西农大主体育场工程",
      //   "children": [{
      //     "value": 'sanhaoshebei',
      //     "label": "三号设备"
      //   },
      //   {
      //     "value": 'qihaoshebei',
      //     "label": "七号设备"
      //   }]
      // },
      // {
      //   "value": 'zhongbeidaxue',
      //   "label": "中北大学",
      //   "children": [{
      //     "value": 'erhaoshebei',
      //     "label": "二号设备"
      //   },
      //   {
      //     "value": 'sihaoshebei',
      //     "label": "四号设备"
      //   }]
      // },
      // {
      //   "value": 'taiyuanligong',
      //   "label": "太原理工大学一号教学楼",
      //   "children": [{
      //     "value": 'wuhaoshebei',
      //     "label": "五号设备"
      //   }]
      // },
      // {
      //   "value": 'xiangnanxueyuan',
      //   "label": "湘南学院",
      //   "children": [{
      //     "value": 'liuhaoshebei',
      //     "label": "六号设备"
      //   }]
      // },
      // {
      //   "value": 'lanzhouligong',
      //   "label": "兰州理工大学",
      //   "children": [{
      //     "value": 'yihaoshebei',
      //     "label": "一号设备"
      //   }]
      // }],

    };
  },
  computed: {},
  methods: {
    //获取id
    getId() {
      for (var i = 0; i < this.options.length; i++) {
        // console.log(this.options[i], '-----');
        if (this.options[i].name == this.option[0]) {
            this.obj.engineer_id = this.options[i].id;
        }
        for (var j = 0; j < this.options[i].children.length; j++) {
          // console.log(this.options[i].children[j]);
          if (this.options[i].children[j].name == this.option[1]) {
            this.obj.device_id = this.options[i].children[j].id;
          }
        } 
      }
      this.obj.bill_why = this.textarea;
      //console.log(this.obj);
    },
    //获取数据
    async getEngData() {
      let res = await get("/engineer/findEngineerDeviceTree");
      //console.log(res, "获取响应");
      this.options = res.data;
      //console.log(this.options);
    },
    //去提交
    toSave() {
      this.getId();
      this.$confirm('此操作将提交该工单, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        //发送请求
        let res = await postJSON('/workorder/repairOrder', this.obj);
        this.$message({
          type: 'success',
          message: '提交成功!'

        });
        //路由跳转
        this.$router.push({
          path:'/am/order/List',
        })
        //刷新页面为1
        //this.params.page=1;
        //刷新页面 重新加载数据
        //this.getEmpData();
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消提交'
        });
      });
    },
  },
  created() { },
  mounted() {

    this.getEngData();
  },
};
</script>
<style></style>